import React from 'react';
import { observer, inject } from 'mobx-react';
import {WeaTools, WeaErrorPage, WeaRightMenu, WeaTop, WeaTab, WeaLocaleProvider, WeaHelpfulTip} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
import { Button,Modal } from 'antd';
import { WeaTableNew } from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
import allStore from '../../stores';
import Condition from './Condition';
import {toJS} from "mobx";

@inject("wfBatchToDocResultStore")
@observer
class ToDocResult extends React.Component{
    componentDidMount(){
        this.doInit(this.props);
        const { wfBatchToDocResultStore } = this.props;
        if(window.location.pathname.indexOf('/spa/workflow/index') > -1)
            document.title = wfBatchToDocResultStore.title;
    }
    doInit(props){
        const { wfBatchToDocResultStore,location } = props;
        wfBatchToDocResultStore.reset();
        const urlParams = location.query || {};
        wfBatchToDocResultStore.setUrlParams(urlParams);
        const fromwhere = urlParams.fromwhere || "index";
        if(fromwhere === "index"){     //来源导航界面搜索
            wfBatchToDocResultStore.copyIndexStore(allStore.wfBatchToDocIndexStore);
        }
        wfBatchToDocResultStore.doSearch();
    }
    componentWillUnmount(){
        const { wfBatchToDocResultStore } = this.props;
        wfBatchToDocResultStore.reset();
    }
    setShowSearchAd= bool=>{this.props.wfBatchToDocResultStore.setShowSearchAd(bool)};
    hideSearchAd=()=>this.props.wfBatchToDocResultStore.setShowSearchAd(false);
    onSearch= () =>{this.props.wfBatchToDocResultStore.doSearch()};
    render(){
        const { wfBatchToDocResultStore } = this.props;
        const { loading,title,fixedForm,showSearchAd,tableStore } = wfBatchToDocResultStore;
        const fixedFormParams = fixedForm && fixedForm.getFormParams() || {};
        return (
            <div className="wf-todoc-result">
                <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@nqqpl3`} 
                    collectParams={{favname:title, favouritetype:2}}
                    datas={this.getRightMenu()}
                >
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@zu14n9`}
                        title={title}
                        loading={loading || tableStore.loading}
                        icon={<i className='icon-coms-workflow' />}
                        iconBgcolor='#0079DE'
                        buttons={this.getTopButtons()}
                        buttonSpace={10}
                        showDropIcon={true}
                        dropMenuDatas={this.getRightMenu()}
                    >
                        <div style={{height: '100%'}}>
                            <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@u7nc57`}
                                buttonsAd={this.getAdButtons()}
                                searchType={['base','advanced']}
                                searchsBaseValue={fixedFormParams.requestname}
                                setShowSearchAd={this.setShowSearchAd}
                                hideSearchAd={this.hideSearchAd}
                                searchsAd={
                                    <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@g9ln5r`} store={wfBatchToDocResultStore} onEnterSearch={this.onSearch} />
                                }
                                showSearchAd={showSearchAd}
                                onSearch={this.onSearch}
                                onSearchChange={v=>{wfBatchToDocResultStore.appendFixedFormFields({requestname:{value:v}})}}
                            />
                            <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@ulti3x`}
                                comsWeaTableStore={tableStore}
                                getColumns={this.getColumns}
                            />
                        </div>
                    </WeaTop>
                </WeaRightMenu>
            </div>
        )
    }

    getColumns = (columns) => {
        const columnsJS = toJS(columns);
        columnsJS.forEach(col => {
            if(col.dataIndex === "unoperators"){
                const title = (
                    <span>
                        <span title={col.title}>
                            { col.title }
                        </span>
                        {<WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@bwhfw2@${col.dataIndex}`} style={{ marginLeft: 5 }} title={getLabel(516719,"可在【个性化设置】中设置未操作者的显示类型")} placement="top" />}
                    </span>
            )
                col.title = title;
            }
        });
        return columnsJS;
    }

    getTopButtons(){
        const { wfBatchToDocResultStore } = this.props;
        const { tableStore } = wfBatchToDocResultStore;
        const selectedRowKeys = tableStore.selectedRowKeys;
        let btns =[];
        btns.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@4bmib2@batchToDoc`} type="primary" disabled={selectedRowKeys.length <= 0} onClick={this.batchToDocClick}>{getLabel(34257,'批量存为文档')}</Button>);
        return btns;
    }
    getRightMenu(){
        const { wfBatchToDocResultStore } = this.props;
        const { tableStore } = wfBatchToDocResultStore;
        const selectedRowKeys = tableStore.selectedRowKeys;
    	let btns = [];
    	btns.push({
            key: "search",
    		icon: <i className='icon-workflow-Right-menu--search'/>,
            content: getLabel(197,'搜索'),
            onClick: this.onSearch
        });
        btns.push({
            key: "batchToDoc",
            icon: <i className='icon-workflow-Right-menu-batch'/>,
            content: getLabel(34257,'批量存为文档'),
            disabled: selectedRowKeys.length <= 0,
            onClick: this.batchToDocClick
        });
        btns.push({
            key: "colSet",
    		icon: <i className='icon-workflow-Right-menu-Custom'/>,
            content: getLabel(32535,'显示列定制'),
            onClick: key =>{
                tableStore.setColSetVisible(true);
    		    tableStore.tableColSet(true);
            }
    	});
    	return btns;
    }
    getAdButtons() {
        const { wfBatchToDocResultStore } = this.props;
        return [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@qn3h59@search`} type="primary" onClick={this.onSearch}>{getLabel(197,'搜索')}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@bu5ka5@reset`} type="ghost" onClick={this.reset}>{getLabel(2022,'重置')}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@o7c9wm@cancel`} type="ghost" onClick={this.cancel}>{getLabel(31129,'取消')}</Button>)
        ];
    }
    reset = ()=>{this.props.wfBatchToDocResultStore.resetCondition()};
    cancel = ()=>{this.props.wfBatchToDocResultStore.setShowSearchAd(false)};
    batchToDocClick = () => {
        const { wfBatchToDocResultStore } = this.props;
        if(!wfBatchToDocResultStore.hasRight){
            Modal.warning({
                title: getLabel(131329,'信息确认'),
                content: getLabel(386201,'您暂未拥有将流程存为文档的权限！'),
                okText: getLabel(83446,'确定')
            });
            return;
        }
        Modal.confirm({
            title: getLabel(131329,'信息确认'),
            content:getLabel(22232,"您确定要将这些流程保存为文档吗？"), 
            onOk() {
                wfBatchToDocResultStore.doBatchToDoc();
            },
            onCancel() {},
            okText: getLabel(83446,'确定'),
            cancelText:getLabel(31129,'取消')
        });
    }
}

export default WeaTools.tryCatch(React, 
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@cibqo5`} msg={ props.error ? props.error : getLabel(383324,' 对不起，该页面异常，请联系管理员 ')+'！'} />,
    {error: ""}
)(ToDocResult);